<template>
	<view v-if="code">
		<view class="wx" v-if="isWechat"></view>
		<view class="content text-center">
			<image src="../../static/images/120x120.png" class="logo" mode="aspectFill"></image>
			<view class=" text-lg text-bold">哗啦哗啦</view>
			<view class="margin-top text-sm"></view>
			<view class="margin-top-xl">
				<a class="xBtn" green @click="launchApp" v-if="item.status == 1">
					<text>打开哗啦哗啦观看直播</text>
				</a>
				<a class="xBtn bg-green" style="background-color: #999;" v-else>
					<text>直播已结束</text>
				</a>
			</view>
		</view>
		<view class=" text-center">
			<view class="">
				来自<text class="text-red text-bold">{{item.username}}</text>的直播分享
			</view>
			<view class="margin-top text-xl text-bold text-green">
				{{item.title}}
			</view>
			<view class="margin-tb text-lg">
				<image :src="item.cover" class="cover" mode="aspectFill"></image>
			</view>
		</view>
	</view>
	<view class="padding" style="padding-top: 100rpx;" v-else>
		<view class="padding panel text-center ">
			<text class="gui-icons" style="font-size: 120rpx;">&#xe6a1;</text>
			<view class="margin-top">直播间不存在</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isWechat: uni.tool.isWechat(),
				item: '',
				code: '',
				isJumped: false
			}
		},
		onLoad(opt) {
			this.code = opt.code
			if (this.code) {
				this.get(opt.code);
			}
		},
		onHide() {
			this.isJumped = true
		},
		methods: {
			get(code) {
				uni.http.post('data/getLiveShareData', {
					code: code
				}, res => {
					this.item = res
				});
			},
			launchApp() {
				// 微信环境处理
				if (this.isWechat) {
					uni.showModal({
						title: '提示',
						content: '请点击右上角，选择"在浏览器打开"',
						showCancel: false
					});
					return;
				}

				// 通用跳转逻辑
				window.location.href = 'sdls:///pages/live/share?code=' + this.code;  
				const fallbackUrl = '/pages/in/down';

	
				// 主检测逻辑
				setTimeout(() => {
					// 如果未检测到跳转成功
					if (this.isJumped == false) {
						
						uni.showModal({
							title:'提示',
							content:'您还没有下载哗啦哗啦APP',
							confirmText:'立即下载',
							success(res) {
								if (res.confirm) {
									uni.navigateTo({
										url: fallbackUrl
									});
								}
							}
						})
						
					}
				}, 2000);
			}

			// launchApp() {
			// 	if (this.isWechat) {
			// 		// 微信环境使用开放标签
			// 		uni.tool.msg('请使用默认浏览器打开');
			// 		return;
			// 	}
			// 	// 普通浏览器环境
			// 	window.location.href = 'sdls:///pages/live/share?code=' + this.code;  

			// 	setTimeout(() => {
			// 		uni.navigateTo({
			// 			url:'/pages/in/down'
			// 		})
			// 	},5000);
			// }
		}
	}
</script>

<style>
	page {
		background-color: #fff;
	}

	.logo {
		width: 100rpx;
		height: 100rpx;
		margin: auto;
		margin-bottom: 30rpx;
	}

	.cover {
		width: 690rpx;
		height: 300rpx;
		margin: auto;
		border-radius: 10rpx;
	}

	.content {
		padding: 100rpx;
	}

	.xBtn {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: flex-end;
		border-radius: 10rpx;
		overflow: hidden;
		text-decoration: none;
	}

	.version {
		font-size: 24rpx;
		background-color: red;
		position: absolute;
		top: 0rpx;
		right: 0rpx;
		height: 40rpx;
		line-height: 40rpx;
		padding: 0 10rpx;
	}

	.wx {
		position: fixed;
		left: 0;
		top: 0;
		background-color: rgba(0, 0, 0, .7);
		width: 100vw;
		height: 100vh;
		background-image: url(../../static/images/wx.png);
		background-size: 100%;
		background-position: 50% 54px;
		background-repeat: no-repeat;
		z-index: 999;
	}
</style>